<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>{$title}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <!--标准mui.css-->
    <link rel="stylesheet" href="__PUBLIC__/mui/css/mui.min.css">
    <script src="__PUBLIC__/static/jquery-2.0.3.min.js"></script>

</head>
<body id="list">
<header class="mui-bar mui-bar-nav">
    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
    <h1 class="mui-title">{$title}</h1>
</header>
<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
    <div class="mui-scroll">
        <ul class="mui-table-view">
            <volist name="list" id="vo">
                <li class="mui-table-view-cell mui-media">
                    <a href="{:addons_url('SchoolNews://News/index',array('href'=>$vo[href]))}">
                        <div class="mui-media-body">
                            {$vo.title}
                            <p class='mui-ellipsis mui-pull-right'>{$vo.date}</p>
                        </div>
                    </a>
                </li>
            </volist>
        </ul>
    </div>
</div>
<footer>
    <div align="center">

        <p style="display:table-cell; vertical-align:middle;">
            <small>&copy;2016 技术支持 敏捷软件协会</small>
        </p>
    </div>
</footer>
</body>
<script src="__PUBLIC__/mui/js/mui.min.js"></script>
<script>
    mui.init({
        pullRefresh: {
            container: '#pullrefresh',
            down: {
                callback: pulldownRefresh
            },
            up: {
                contentrefresh: '正在加载...',
                callback: pullupRefresh
            }
        }
    });
    /**
     * 下拉刷新具体业务实现
     */
    function pulldownRefresh() {
        window.location.reload();
    }
    var count = 1;
    var href="{$href}";
    var url="{:addons_url('SchoolNews://NewsList/pullup')}";
    /**
     * 上拉加载具体业务实现
     */
    function pullupRefresh() {

        $.post(url, {p: count, href: href,}, function (data) {
            count++;
            if (data!=null){

                var table = document.body.querySelector('.mui-table-view');
                $.each(data, function (index, item) {
                    var li = document.createElement('li');
                    li.className = 'mui-table-view-cell';
                    li.innerHTML = "<a href=\"{__APP__//addon/SchoolNews/News/index/href/"+data[index].href+".html}\"><div class='mui-media-body'>" + data[index].title + "<p class=\"mui-ellipsis mui-pull-right\">"+data[index].date+"</p> </div></a>";
                    table.appendChild(li);
                    mui('#pullrefresh').pullRefresh().endPullupToRefresh();
                });
            }else {

                mui('#pullrefresh').pullRefresh().endPullupToRefresh();
            }
        });
    }
</script>
<script src="__PUBLIC__/mui/js/main_t.js"></script>
</html>